/**
 * 用户菜单 管理员工作页面
 */
<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>我的工作</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 个人详情信息 -->
    <div class="personaldetails">
        <el-avatar shape="circle" :size="200"  :src="userinfo.portrait"></el-avatar>
        <div class="personaldetails_text">
            <div class="personaldetails_text_detail">用户序号：
                <span>{{userinfo.id}}</span>
            </div>
            <div class="personaldetails_text_detail">学生证号：
                <span>{{userinfo.certificate_number}}</span>
            </div>
            <div class="personaldetails_text_detail">学生证类型：
                <span>{{userinfo.certificate_type}}</span>
            </div>
            <div class="personaldetails_text_detail">笔记：
                <el-image :src="userinfo.note"></el-image>
            </div>
            <div class="personaldetails_text_detail">学生证类型：
                <span>{{userinfo.user}}</span>
            </div>
            <el-button size="mini"  type="success" @click="acceptUser()">活动主体</el-button>
            <el-button size="mini" type="danger" @click="refuseUser()">一般用户</el-button>
        </div>
    </div>
    <!-- 参与活动列表 -->
    
    <el-table size="small" :data="userinfo.listData" highlight-current-row v-loading="loading" border element-loading-text="拼命加载中" style="width: 100%;" class="partActivity">
        <el-table-column align="center" type="selection" width="60">
        </el-table-column>
        <el-table-column sortable prop="id" label="参与活动序号" width="130">
        </el-table-column>
        <el-table-column sortable prop="image" label="图片" width="100">
        </el-table-column>
        <el-table-column sortable prop="originator__nickname" label="参与者昵称" width="200">
        </el-table-column>
        <el-table-column sortable prop="originator__portrait" label="参与者头像" width="200">
        </el-table-column>
    </el-table>
    <!-- 发起活动列表 -->
    
    <el-table size="small" :data="userinfo.listData" highlight-current-row v-loading="loading" border element-loading-text="拼命加载中" style="width: 100%;" class="partActivity">
        <el-table-column align="center" type="selection" width="60">
        </el-table-column>
        <el-table-column sortable prop="id" label="发起活动序号" width="130">
        </el-table-column>
        <el-table-column sortable prop="image" label="图片" width="100">
        </el-table-column>
        <el-table-column sortable prop="originator__nickname" label="发起者昵称" width="200">
        </el-table-column>
        <el-table-column sortable prop="originator__portrait" label="发起者头像" width="200">
        </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {userWorkNow,userGetWork,userApplyRes} from "../../api/basisMG"
export default {
    data(){
        return {
            loading:false,
            userinfo:{
                userID:1,
            },
            listdata:[

            ],
            agreement:{
                applyID:16,
                result:"Merchant",
                reason:"恭喜，您的身份为活动发布者"
            },
            disagreement:{
                applyID:16,
                result:"Authorized",
                reason:"您的身份为活动参与者"
            },

        }
    },
  // 注册组件
  components: {
  },
  /**
   * 数据发生改变
   */

  /**
   * 创建完毕
   */
  created() {
    console.log(this.$route)
    this.userinfo.applyID = this.$route.query.userId
    console.log(this.userinfo)
    this.getdata(this.userinfo)
  },

  /**
   * 里面的方法只有被调用才会执行
   */
   methods: {
        getdata(userinfo){
            userGetWork(userinfo)
            .then(res=>{
                console.log(res)
                userWorkNow()
                .then(res=>{
                    console.log(res)
                    this.userinfo = res.data
                    console.log(this.userinfo)
                })
            }).catch(res=>{
                this.$message({
                type: 'info',
                message: res.data
            })
            })
        },
        refuseUser(){
            this.$confirm('是否确认拒绝该人员申请主体资格','提示',{
                confirmButtonText:'确定',
                cancelButtonText:'取消',
                type:'warning'
            }).then(() =>{
                this.disagreement.applyID = this.userinfo.id;
                userApplyRes(this.disagreement)
                .then(res=>{
                console.log(res)
                })
                this.$message({
                type:'success',
                message:'拒绝了该人员申请主体资格'
                });
            }).catch(() =>{
                this.$message({
                type:'info',
                message:'已取消拒绝该人员申请主体资格'
                })
            })
    },
    acceptUser(index,row){
      this.$confirm('是否确认接受该人员申请主体资格','提示',{
        confirmButtonText:'确定',
        cancelButtonText:'取消',
        type:'warning'
      }).then(() =>{
        this.$message({
          type:'success',
          message:'接受了该人员申请主体资格'
        });    
        this.agreement.applyID = this.userinfo.id;
        userApplyRes(this.agreement)
        .then(res=>{
          console.log(res)
        })
      }).catch(() =>{
        this.$message({
          type:'info',
          message:'已取消接受该人员申请主体资格'
        })
      })
    },
    }
}
</script>

<style scoped>
.personaldetails{
    display: flex;
    float: left;
    width: 100%;
}
.personaldetails_text{
    width: 40%;
    margin-left: 10%;
}
.personaldetails_text_detail{
    margin-top: 5%;
}

</style>

 
 
